<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
    <%-- <%@ taglib prefix="c"uri="http://java.sun.com/jstl/core" %> --%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>搜索以及下方弹出栏</title>
	<link rel="stylesheet" typr="text/css" href="../css/cart.min.css">
	<link rel="stylesheet" typr="text/css" href="../css/base.min.css">
	<link rel="stylesheet" typr="text/css" href="../css/index.min.css">
	<link rel="stylesheet" typr="text/css" href="../css/Search.css">
<script type="text/javascript" src="../js/jquery-3.3.1.min.js"></script>
<script type="text/javascript">
$(function (){
	$("#header-search").click(function(){
	    $("#keyword-list hide").hide();
	    $("#search-hot-words").css('display','none');
	},function(){ 
	    $("#J_miniCartMenu").hide();
	    $("#search-hot-words").css('display','none');
});
}); 

</script>
<style type="text/css">
.search-form {
    position: relative;
    width: 296px;
    height: 50px;
}
</style>
</head>
<body>
<div class="site-header">
		<div class="container">
			<div class="header-logo">
				<a class="logo ir" href="../html/zhuye.html" title="小米官网">小米官网</a>
			</div>
			<!-- 搜索栏导航栏 -->
			<div class="header-nav">
            <ul class="nav-list J_navMainList clearfix">
                <li id="J_navCategory" class="nav-category">
                    <div class="item-children">
              
                </li>
                                <li class="nav-item">
                    <a class="link" href="GoodsServlet?op="  onclick=""><span class="text">小米手机</span><span class="arrow"></span></a>
                    <div class="item-children">
                       <div class="container">
                            <ul class="children-list clearfix">
                                                            <li class="first">
                                    <div class="figure figure-thumb">
                                        <a href="" ><img src="//i1.mifile.cn/f/i/2014/cn/placeholder-220!110x110.png" data-src="//i1.mifile.cn/f/i/g/2015/cn-index/mi9-320.png" alt="小米9" width="160" height="110"></a>
                                    </div>
                                    <div class="title"><a href="https://www.mi.com/mi9/"  >小米9</a></div>
                                    <p class="price">2999元起</p>                                    <div class="flags"><div class="flag">新品</div></div>                                </li>
                                                            <li>
                                    <div class="figure figure-thumb">
                                        <a href="" ><img src="//i1.mifile.cn/f/i/2014/cn/placeholder-220!110x110.png" data-src="//i1.mifile.cn/f/i/g/2015/cn-index/mi9se-320.png" alt="小米9 SE" width="160" height="110"></a>
                                    </div>
                                    <div class="title">
                                    	<a href=""  >小米9 SE</a></div>
                                    <p class="price">1999元起</p>                                    <div class="flags"><div class="flag">新品</div></div>                                </li>
                                                            <li>
                                    <div class="figure figure-thumb">
                                        <a href="" ><img src="//i1.mifile.cn/f/i/2014/cn/placeholder-220!110x110.png" data-src="//i1.mifile.cn/f/i/g/2015/cn-index/mix3-320.png" alt="小米MIX 3" width="160" height="110"></a>
                                    </div>
                                    <div class="title">
                                    	<a href="" >小米MIX 3</a></div>
                                    <p class="price">3299元起</p>                                                                    </li>
                                                            <li>
                                    <div class="figure figure-thumb">
                                        <a href="" ><img src="//i1.mifile.cn/f/i/2014/cn/placeholder-220!110x110.png" data-src="//i1.mifile.cn/f/i/g/2015/cn-index/qingchun-320.png" alt="小米8 青春版" width="160" height="110"></a>
                                    </div>
                                    <div class="title">
                                    	<a href=""  >小米8 青春版</a></div>
                                    <p class="price">1499元起</p>                                                                    </li>
                                                            <li>
                                    <div class="figure figure-thumb">
                                        <a href="" ><img src="//i1.mifile.cn/f/i/2014/cn/placeholder-220!110x110.png" data-src="//i1.mifile.cn/f/i/g/2015/cn-index/pc-320-220-mi8.png" alt="小米8" width="160" height="110"></a>
                                    </div>
                                    <div class="title">
                                    	<a href=""  >小米8</a></div>
                                    <p class="price">2599元起</p>                                                                    </li>
                                                            <li>
                                    <div class="figure figure-thumb">
                                        <a href=""  ><img src="//i1.mifile.cn/f/i/2014/cn/placeholder-220!110x110.png" data-src="//i1.mifile.cn/f/i/g/2015/cn-index/pc-320-miplay-1.png" alt="小米Play" width="160" height="110"></a>
                                    </div>
                                    <div class="title">
                                    	<a href="" >小米Play</a></div>
                                    <p class="price">1099元</p>                                    <div class="flags"><div class="flag">新品</div></div>                                </li>
                                                        </ul>
                        </div>
                    </div>
                				</li>
                                <li class="nav-item">
                    <a class="link" href=""  onclick=""><span class="text">红米</span><span class="arrow"></span></a>
                    <div class="item-children">
                        <div class="container">
                            <ul class="children-list clearfix">
                                                            <li class="first">
                                    <div class="figure figure-thumb">
                                        <a href="" ><img src="//i1.mifile.cn/f/i/2014/cn/placeholder-220!110x110.png" data-src="//i1.mifile.cn/f/i/g/2015/cn-index/note7320-220.png" alt="红米Note 7" width="160" height="110"></a>
                                    </div>
                                    <div class="title">
                                    	<a href="" >红米Note 7</a></div>
                                    <p class="price">999元起</p>                                    <div class="flags"><div class="flag">新品</div></div>                                </li>
                                                            <li>
                                    <div class="figure figure-thumb">
                                        <a href="" ><img src="//i1.mifile.cn/f/i/2014/cn/placeholder-220!110x110.png" data-src="//i1.mifile.cn/f/i/g/2015/cn-index/666320.png" alt="红米6" width="160" height="110"></a>
                                    </div>
                                    <div class="title">
                                    	<a href="" >红米6</a></div>
                                    <p class="price">729元</p>                                                                    </li>
                                                            <li>
                                    <div class="figure figure-thumb">
                                        <a href=""><img src="//i1.mifile.cn/f/i/2014/cn/placeholder-220!110x110.png" data-src="//i1.mifile.cn/f/i/g/2015/cn-index/6A320.png" alt="红米6A" width="160" height="110"></a>
                                    </div>
                                    <div class="title">
                                    	<a href="" >红米6A</a></div>
                                    <p class="price">549元</p>                                                                    </li>
                                                            <li>
                                    <div class="figure figure-thumb">
                                        <a href="" ><img src="//i1.mifile.cn/f/i/2014/cn/placeholder-220!110x110.png" data-src="//i1.mifile.cn/f/i/g/2015/cn-index/note5-320-220.png" alt="红米Note 5" width="160" height="110"></a>
                                    </div>
                                    <div class="title">
                                    	<a href="" >红米Note 5</a></div>
                                    <p class="price">1049元</p>                                                                    </li>
                                                        </ul>
                        </div>
                    </div>
                				</li>
                                <li class="nav-item">
                    <a class="link" href=""  onclick=""><span class="text">电视</span><span class="arrow"></span></a>
                    <div class="item-children">
                        <div class="container">
                            <ul class="children-list clearfix">
                                                            <li class="first">
                                    <div class="figure figure-thumb">
                                        <a href="" ><img src="//i1.mifile.cn/f/i/2014/cn/placeholder-220!110x110.png" data-src="//i1.mifile.cn/f/i/g/2015/cn-index/4s75.png" alt="小米电视4S 75英寸" width="160" height="110"></a>
                                    </div>
                                    <div class="title">
                                    	<a href="" >小米电视4S 75英寸</a></div>
                                    <p class="price">7999元</p>                                    <div class="flags"><div class="flag">新品</div></div>                                </li>
                                                            <li>
                                    <div class="figure figure-thumb">
                                        <a href="" ><img src="//i1.mifile.cn/f/i/2014/cn/placeholder-220!110x110.png" data-src="//i1.mifile.cn/f/i/g/2015/cn-index/32.png" alt="小米电视4A 32英寸" width="160" height="110"></a>
                                    </div>
                                    <div class="title">
                                    	<a href="" >小米电视4A 32英寸</a></div>
                                    <p class="price">799元</p>                                    <div class="flags"><div class="flag">热卖</div></div>                                </li>
                                                            <li>
                                    <div class="figure figure-thumb">
                                        <a href="" ><img src="//i1.mifile.cn/f/i/2014/cn/placeholder-220!110x110.png" data-src="//i1.mifile.cn/f/i/g/2015/cn-index/4a43.png" alt="小米电视4A 43英寸青春版" width="160" height="110"></a>
                                    </div>
                                    <div class="title">
                                    	<a href="" >小米电视4A 43英寸青春版</a></div>
                                    <p class="price">1499元</p>                                    <div class="flags"><div class="flag">新品</div></div>                                </li>
                                                            <li>
                                    <div class="figure figure-thumb">
                                        <a href="" ><img src="//i1.mifile.cn/f/i/2014/cn/placeholder-220!110x110.png" data-src="//i1.mifile.cn/f/i/g/2015/cn-index/50.png" alt="小米电视4A 50英寸" width="160" height="110"></a>
                                    </div>
                                    <div class="title">
                                    	<a href="" >小米电视4A 50英寸</a></div>
                                    <p class="price">1999元</p>                                    <div class="flags"><div class="flag">热卖</div></div>                                </li>
                                                            <li>
                                    <div class="figure figure-thumb">
                                        <a href="" ><img src="//i1.mifile.cn/f/i/2014/cn/placeholder-220!110x110.png" data-src="//i1.mifile.cn/f/i/g/2015/cn-index/4A-55.jpg" alt="小米电视4A 55英寸" width="160" height="110"></a>
                                    </div>
                                    <div class="title">
                                    	<a href="" >小米电视4A 55英寸</a></div>
                                    <p class="price">2299元</p>                                    <div class="flags"><div class="flag">热卖</div></div>                                </li>
                                                            <li>
                                    <div class="figure figure-thumb">
                                        <a href="" ><img src="//i1.mifile.cn/f/i/2014/cn/placeholder-220!110x110.png" data-src="//i1.mifile.cn/f/i/g/2015/cn-index/475toutu.png" alt="查看全部<br/>小米电视" width="160" height="110"></a>
                                    </div>
                                    <div class="title">
                                    	<a href="" >查看全部<br>小米电视</a></div>
                                                                                                        </li>
                                                        </ul>
                        </div>
                    </div>
                				</li>
                                <li class="nav-item">
                    <a class="link" href=""  onclick=""><span class="text">笔记本</span><span class="arrow"></span></a>
                    <div class="item-children">
                        <div class="container">
                            <ul class="children-list clearfix">
                                                            <li class="first">
                                    <div class="figure figure-thumb">
                                        <a href="" ><img src="//i1.mifile.cn/f/i/2014/cn/placeholder-220!110x110.png" data-src="//i1.mifile.cn/f/i/g/2015/video/bijiben32012.5.jpg" alt="小米笔记本 Air 12.5" "="" width="160" height="110"></a>
                                    </div>
                                    <div class="title">
                                    	<a href="" >小米笔记本 Air 12.5"</a></div>
                                    <p class="price">3599起</p>                                                                    </li>
                                                            <li>
                                    <div class="figure figure-thumb">
                                        <a href="" ><img src="//i1.mifile.cn/f/i/2014/cn/placeholder-220!110x110.png" data-src="//i1.mifile.cn/f/i/g/2015/daohang13.3.jpg" alt="小米笔记本 Air 13.3" "="" width="160" height="110"></a>
                                    </div>
                                    <div class="title">
                                    	<a href="" >小米笔记本 Air 13.3"</a></div>
                                    <p class="price">4999元起</p>                                                                    </li>
                                                            <li>
                                    <div class="figure figure-thumb">
                                        <a href="" ><img src="//i1.mifile.cn/f/i/2014/cn/placeholder-220!110x110.png" data-src="//i1.mifile.cn/f/i/g/320x220biiben.png" alt="小米笔记本 15.6" "="" width="160" height="110"></a>
                                    </div>
                                    <div class="title">
                                    	<a href="" >小米笔记本 15.6"</a></div>
                                    <p class="price">4199元起</p>                                                                    </li>
                                                            <li>
                                    <div class="figure figure-thumb">
                                        <a href="" ><img src="//i1.mifile.cn/f/i/2014/cn/placeholder-220!110x110.png" data-src="//i1.mifile.cn/f/i/g/2015/cn-index/WechatIMG603.png" alt="小米笔记本 Pro 15.6" "="" width="160" height="110"></a>
                                    </div>
                                    <div class="title">
                                    	<a href="" >小米笔记本 Pro 15.6"</a></div>
                                    <p class="price">5199元起</p>                                    <div class="flags"><div class="flag">热剧同款</div></div>                                </li>
                                                            <li>
                                    <div class="figure figure-thumb">
                                        <a href="" ><img src="//i1.mifile.cn/f/i/2014/cn/placeholder-220!110x110.png" data-src="//i1.mifile.cn/f/i/g/2015/xinbijiben.png" alt="小米游戏本" width="160" height="110"></a>
                                    </div>
                                    <div class="title">
                                    	<a href="" >小米游戏本</a></div>
                                    <p class="price">6699元起</p>                                                                    </li>
                                                            <li>
                                    <div class="figure figure-thumb">
                                        <a href="" ><img src="//i1.mifile.cn/f/i/2014/cn/placeholder-220!110x110.png" data-src="//i1.mifile.cn/f/i/g/2015/cn-index/pingbanok.png" alt="小米平板" width="160" height="110"></a>
                                    </div>
                                    <div class="title">
                                    	<a href="" >小米平板</a></div>
                                    <p class="price">1099元起</p>                                                                    </li>
                                                        </ul>
                        </div>
                    </div>
                </li>
                                <li class="nav-item">
                    <a class="link" href=""  onclick=""><span class="text">家电</span><span class="arrow"></span></a>
                    <div class="item-children">
                        <div class="container">
                            <ul class="children-list clearfix">
                                                            <li class="first">
                                    <div class="figure figure-thumb">
                                        <a href=""  onclick=""><img src="//i1.mifile.cn/f/i/2014/cn/placeholder-220!110x110.png" data-src="//i1.mifile.cn/f/i/g/2015/cn-index/320_220.jpg" alt="米家互联网洗烘一体机10kg" width="160" height="110"></a>
                                    </div>
                                    <div class="title">
                                    	<a href="" >米家互联网洗烘一体机10kg</a></div>
                                    <p class="price">2499元</p>                                                                    </li>
                                                            <li>
                                    <div class="figure figure-thumb">
                                        <a href=""  ><img src="//i1.mifile.cn/f/i/2014/cn/placeholder-220!110x110.png" data-src="//i1.mifile.cn/f/i/g/2015/cn-index/yijinengxiao320.jpg" alt="米家互联网空调（一级能效）" width="160" height="110"></a>
                                    </div>
                                    <div class="title">
                                    	<a href=""  >米家互联网空调（一级能效）</a></div>
                                    <p class="price">2699元</p>                                                                    </li>
                                                            <li>
                                    <div class="figure figure-thumb">
                                        <a href=""  ><img src="//i1.mifile.cn/f/i/2014/cn/placeholder-220!110x110.png" data-src="//i1.mifile.cn/f/i/g/2015/yijinegxiaokongtiaoxin.jpg" alt="米家互联网空调" width="160" height="110"></a>
                                    </div>
                                    <div class="title">
                                    	<a href=""  >米家互联网空调</a></div>
                                    <p class="price">2299元</p>                                                                    </li>
                                                            <li>
                                    <div class="figure figure-thumb">
                                        <a href=""  ><img src="//i1.mifile.cn/f/i/2014/cn/placeholder-220!110x110.png" data-src="//i1.mifile.cn/f/i/g/2015/xiaomijingshuiqi.jpg" alt="小米净水器" width="160" height="110"></a>
                                    </div>
                                    <div class="title">
                                    	<a href=""  >小米净水器</a></div>
                                    <p class="price">1999元</p>                                                                    </li>
                                                            <li>
                                    <div class="figure figure-thumb">
                                        <a href=""  ><img src="//i1.mifile.cn/f/i/2014/cn/placeholder-220!110x110.png" data-src="//i1.mifile.cn/f/i/g/2015/cn-index/saodijiqiren320-220.jpg" alt="米家扫地机器人" width="160" height="110"></a>
                                    </div>
                                    <div class="title">
                                    	<a href=""  >米家扫地机器人</a></div>
                                    <p class="price">1699元</p>                                                                    </li>
                                                            <li>
                                    <div class="figure figure-thumb">
                                        <a href=""  ><img src="//i1.mifile.cn/f/i/2014/cn/placeholder-220!110x110.png" data-src="//i1.mifile.cn/f/i/g/2015/xinfeng.jpg" alt="新风机" width="160" height="110"></a>
                                    </div>
                                    <div class="title">
                                    	<a href=""  >新风机</a></div>
                                    <p class="price">2699元</p>                                                                    </li>
                                                        </ul>
                        </div>
                    </div>
                				</li>
                                <li class="nav-item">
                    <a class="link" href=""  onclick=""><span class="text">新品</span><span class="arrow"></span></a>
                    <div class="item-children">
                        <div class="container">
                            <ul class="children-list clearfix">
                                                            <li class="first">
                                    <div class="figure figure-thumb">
                                        <a href=""  ><img src="//i1.mifile.cn/f/i/2014/cn/placeholder-220!110x110.png" data-src="//i1.mifile.cn/f/i/g/2019/mi9-320.jpg" alt="小米9" width="160" height="110"></a>
                                    </div>
                                    <div class="title">
                                    	<a href=""  >小米9</a></div>
                                    <p class="price">2999元起</p>                                    <div class="flags"><div class="flag">新品</div></div>                                </li>
                                                            <li>
                                    <div class="figure figure-thumb">
                                        <a href=""  ><img src="//i1.mifile.cn/f/i/2014/cn/placeholder-220!110x110.png" data-src="//i1.mifile.cn/f/i/g/2019/mi9-se-320.jpg" alt="小米9 SE" width="160" height="110"></a>
                                    </div>
                                    <div class="title">
                                    	<a href=""  >小米9 SE</a></div>
                                    <p class="price">1999元起</p>                                    <div class="flags"><div class="flag">新品</div></div>                                </li>
                                                            <li>
                                    <div class="figure figure-thumb">
                                        <a href=""  ><img src="//i1.mifile.cn/f/i/2014/cn/placeholder-220!110x110.png" data-src="//i1.mifile.cn/f/i/g/2019/redminote-7-320.jpg" alt="红米Note 7" width="160" height="110"></a>
                                    </div>
                                    <div class="title">
                                    	<a href=""  >红米Note 7</a></div>
                                    <p class="price">999元起</p>                                                                    </li>
                                                            <li>
                                    <div class="figure figure-thumb">
                                        <a href=""  ><img src="//i1.mifile.cn/f/i/2014/cn/placeholder-220!110x110.png" data-src="//i1.mifile.cn/f/i/g/2019/chongdianbao-320.jpg" alt="小米无线充电宝 10000mAh" width="160" height="110"></a>
                                    </div>
                                    <div class="title">
                                    	<a href=""  >小米无线充电宝 10000mAh</a></div>
                                    <p class="price">149元</p>                                                                    </li>
                                                            <li>
                                    <div class="figure figure-thumb">
                                        <a href=""  ><img src="//i1.mifile.cn/f/i/2014/cn/placeholder-220!110x110.png" data-src="//i1.mifile.cn/f/i/g/2019/wuxianchechong-320.jpg" alt="小米无线车充" width="160" height="110"></a>
                                    </div>
                                    <div class="title">
                                    	<a href="" >小米无线车充</a></div>
                                    <p class="price">169元</p>                                                                    </li>
                                                            <li>
                                    <div class="figure figure-thumb">
                                        <a href=""  ><img src="//i1.mifile.cn/f/i/2014/cn/placeholder-220!110x110.png" data-src="//i1.mifile.cn/f/i/g/2019/lifaqi-320.jpg" alt="米兔婴儿理发器" width="160" height="110"></a>
                                    </div>
                                    <div class="title">
                                    	<a href=""  >米兔婴儿理发器</a></div>
                                    <p class="price">119元</p>                                                                    </li>
                                                        </ul>
                        </div>
                    </div>
                				</li>
                                <li class="nav-item">
                    <a class="link" href=""  onclick=""><span class="text">路由器</span><span class="arrow"></span></a>
                    <div class="item-children">
                        <div class="container">
                        </div>
                    </div>
                				</li>
                                <li class="nav-item">
                    <a class="link" href=""  onclick=""><span class="text">智能硬件</span><span class="arrow"></span></a>
                    <div class="item-children">
                        <div class="container">
                        </div>
                    </div>
                				</li>
                                <li class="nav-item"><a class="link" ><span class="text">服务</span></a>
                				</li>
                                <li class="nav-item"><a class="link" ><span class="text">社区</span></a>
                				</li>
                            </ul>
        </div>

			<!-- 结束搜索栏 -->
			<!-- 搜索 -->
			<div class="header-search">
            <form id="J_searchForm" class="search-form clearfix" action="GoodsServlet?op=goodslike" method="get">
                <input class="search-text" type="search" id="search" name="keyword" >
                <input type="submit" class="search-btn iconfont" value="">
                <div class="search-hot-words" style="display: block;">
                   <a href="../">小米9</a>
					<a href="../">小米9 SE</a>
				</div> 
            	<div id="J_keywordList" class="keyword-list hide">
						<ul class="result-list">
						<li data-key="小米6X">
						<a href="//search.mi.com/search_%E5%B0%8F%E7%B1%B36X">
						<span class="keyword"></span> 小米6X
						<span class="result">约有6件</span>
						</a>
						</li>
						<li data-key="小米MIX&nbsp;2S">
						<a href="//search.mi.com/search_%E5%B0%8F%E7%B1%B3MIX%C2%A02S">
						<span class="keyword"></span> 小米MIX&nbsp;2S
						<span class="result">约有5件</span>
						</a>
						</li>
						<li data-key="黑鲨游戏手机">
						<a href="//search.mi.com/search_%E9%BB%91%E9%B2%A8%E6%B8%B8%E6%88%8F%E6%89%8B%E6%9C%BA">
						<span class="keyword"></span> 黑鲨游戏手机
						<span class="result">约有3件</span>
						</a>
						</li>
						<li data-key="红米Note&nbsp;5">
						<a href="//search.mi.com/search_%E7%BA%A2%E7%B1%B3Note%C2%A05">
						<span class="keyword"></span> 红米Note&nbsp;5
						<span class="result">约有6件</span>
						</a>
						</li>
						<li data-key="红米5A">
						<a href="//search.mi.com/search_%E7%BA%A2%E7%B1%B35A">
						<span class="keyword"></span> 红米5A
						<span class="result">约有13件</span>
						</a>
						</li>
						<li data-key="小米电视4C">
						<a href="//search.mi.com/search_%E5%B0%8F%E7%B1%B3%E7%94%B5%E8%A7%864C">
						<span class="keyword"></span> 小米电视4C
						<span class="result">约有5件</span>
						</a>
						</li>
						<li data-key="电视32英寸"><a href="//search.mi.com/search_%E7%94%B5%E8%A7%8632%E8%8B%B1%E5%AF%B8"><span class="keyword"></span> 电视32英寸<span class="result">约有3件</span></a></li><li data-key="笔记本pro"><a href="//search.mi.com/search_%E7%AC%94%E8%AE%B0%E6%9C%ACpro"><span class="keyword"></span> 笔记本pro<span class="result">约有5件</span></a></li><li data-key="空气净化器"><a href="//search.mi.com/search_%E7%A9%BA%E6%B0%94%E5%87%80%E5%8C%96%E5%99%A8"><span class="keyword"></span> 空气净化器<span class="result">约有11件</span></a></li><li data-key="净水器"><a href="//search.mi.com/search_%E5%87%80%E6%B0%B4%E5%99%A8"><span class="keyword"></span> 净水器<span class="result">约有8件</span></a></li></ul></div>
							
        			</div>
					<!-- 结束搜索 -->
			</div>
		</div>
</body>
</html>
                
                